<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
		<script type="text/javascript" src="../../include-all.js"></script>
		<script type="text/javascript">
			
			var view = new dorado.widget.View({
				layout: new dorado.widget.layout.AnchorLayout({
				})
			});
			
			var panel = new dorado.widget.Panel({
				layout: new dorado.widget.layout.DockLayout(),
				width: "100%",
				height: 30
			});
			view.addChild(panel);
			
			var cb1 = new dorado.widget.CheckBox({
				id: "cb1",
				caption: "测试一下"
			});
			
			view.addChild(cb1);
			
			var cb0 = new dorado.widget.CheckBox({
				id: "cb0",
				caption: "测试一下(TriState)",
				triState: true
			});
			
			//view.addChild(cb0);
			
			var count = 1;
			
			panel.addChild(new dorado.widget.Button({
				caption: "Set Checked",
				listener: {
					onClick: function() {
						var cb1 = this.id("cb1");
						cb1.set("checked", !cb1.get("checked"));
					}
				},
				layoutConstraint: "left"
			}));
			
			panel.addChild(new dorado.widget.Button({
				caption: "Set Text",
				listener: {
					onClick: function() {
						cb1.set("caption", "第" + count++ + "次修改caption");
					}
				},
				layoutConstraint: "left"
			}));
			
			panel.addChild(new dorado.widget.Button({
				caption: "Set ReadOnly",
				listener: {
					onClick: function() {
						var cb1 = this.id("cb1");
						cb1.set("readOnly", !cb1.get("readOnly"));
					}
				},
				layoutConstraint: "left"
			}));
			
			panel.addChild(new dorado.widget.Button({
				caption: "Get Value",
				listener: {
					onClick: function() {
						var cb1 = this.id("cb1");
						alert(cb1.get("value"));
					}
				},
				layoutConstraint: "left"
			}));
			
			var cb2 = new dorado.widget.CheckBox({
				iconOnly: true,
				checked: true
			});
			
            view.addChild(cb2);
			
			var cb3 = new dorado.widget.CheckBox({
				iconOnly: true,
				checked: true,
				triState: true
			});
			
			view.addChild(cb3);
			
			$(document).ready(function() {
                cb0.render(jQuery("#cbCt")[0]);
				view.render(document.body);
			});
		</script>
	</head>
	<body>
        <div id="cbCt" style="width: 100px;"></div>
	</body>
</html>
